﻿@model Common.Background.WebManageUsers
@{Layout = "";}
<fieldset>
    <legend>部门</legend>
    @Html.Action("PartialDepartment", "Common")
</fieldset>
<fieldset>
    <legend>角色</legend>
    <div id="roleList">
    </div>
</fieldset>
<p>
    <input type="button" value="添加到选择区" id="addToSelection" />
</p>
<fieldset>
    <legend>选中的角色</legend>
    <div id="Selection">
    </div>
</fieldset>
<script id="commentTemplate" type="text/html">
    <div style="margin: 2px">
        <span style="background-color: #5C87B2; color: #fff; margin: 5px; padding: 2px; padding-right: 0px">
            <input type="hidden" value="[Platform_SubValValue]" id="[Platform_SubValID]" name="Platform_SubVal">
            【[platform]】
           <input type="hidden" value="[VIDValue]" id="WebManageRoles.ManageRoleID[VIDValue]" name="WebManageRoles.ManageRoleID">[VIDDisplayName]  
           <input type="button" style="background: #5C87B2; color: #fff; border: 0px;" onclick="delSelFun(this)" name="delSel" value="×">
        </span>
    </div>
</script>
@if (Model != null)
{
    foreach (var item in Model.WebManageRoles.GroupBy(i => i.DepartmentID))
    {

        foreach (var sub in item)
        {
    <script type="text/javascript">
        var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
        var html = document.getElementById("commentTemplate").innerHTML;
        var source = html.replace(reg, function (node, key) {
            return {
                'Platform_SubValValue': '@(item.Key)',
                'Platform_SubValID': 'Dept' + '@(item.Key)',
                'platform': '@(new Common.Background.BLL.UserManager().GetDept(item.Key).DepartmentName)',
                'VIDValue': '@(sub.ManageRoleID)',
                'VIDDisplayName': '@sub.RoleName'
            }[key];
        });
        $("#Selection").append(source);
    </script>
        }
    }
}
<script type="text/javascript">
    LoadJS('/Scripts/jquery-1.4.4.min.js');//动态加载JS，如果直接<script>这时会有JS冲突

    // 删除模块
    function delSelFun(o) {
        $(o).closest("span").closest("div").remove();
    }

    var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
    var html = document.getElementById("commentTemplate").innerHTML;
    //Dept单击事件
    $("input[name=Dept]").live("click", function () {
        var deptid = $("input[name=Dept]:checked").val();
        if (deptid == undefined)
            deptid = $("input[name=Dept]").first().val()
        $.get("/Common/PartialRole", { deptID: deptid }, function (data) {
            $("#roleList").html(data);
        });
    });
    //首次加载时，模拟Dept单击事件
    $("input[name=Dept]").first().trigger("click");

    //添加到选择区
    $("#addToSelection").click(function () {
        var dept = $("input[name=Dept]:checked").val();
        var vidArr = '';
        var vidDisplayName = '';
        var vidArray = [];
        var vidDisplayNameArray = []
        $("input[name='roleID']:checked").each(function (i, o) {
            vidArr += $(o).val() + ",";
            vidArray.push($(o).val());
        });

        $("input[name='roleID']:checked").each(function (i, o) {
            vidDisplayName += $(o).next("label").text() + ",";
            vidDisplayNameArray.push($(o).next("label").text());
        });

        for (var i = 0, count = vidArray.length; i < count; i++) {
            var source = html.replace(reg, function (node, key) {
                return {
                    'Platform_SubValValue': dept,
                    'Platform_SubValID': 'Role' + dept,
                    'platform': $("input[name=Dept]:checked").next("label").text(),
                    'VIDValue': vidArray[i],
                    'VIDDisplayName': vidDisplayNameArray[i]
                }[key];
            });
            var boolean = true; //是否已经添加了该选项
            $("#Selection").find("input[name='WebManageRoles.ManageRoleID']").each(function (a, b) {
                if ($(b).val() == vidArray[i]) {
                    boolean = false;
                    return;
                }
            });
            if (boolean)
                $("#Selection").append(source);
        }

    });
 
</script>
